{% extends "front/settings.html" %}

{% block content %}
    <div class="profile-container">
        <div class="profile-header">
            <h2>账号设置</h2>
        </div>

        <div class="profile-form">
            <!-- 头像修改 -->
            <div class="form-group">
                <label class="form-label">头像</label>
                <div class="avatar-upload-section">
                    <img id="avatar-preview"
                         src="{{ url_for('media.get_avatar', filename=g.user.avatar) if g.user.avatar else url_for('media', filename='/avatars/default_avatar.png') }}"
                         alt="用户头像" class="user-avatar-preview">
                    <div class="avatar-upload-btn">
                        <button type="button" id="upload-avatar-btn" class="btn btn-primary">更换头像</button>
                        <input type="file" id="avatar-input" accept="image/*" style="display: none;">
                    </div>
                </div>
            </div>

            <!-- 用户名修改 -->
            <div class="form-group">
                <label for="username" class="form-label">用户名</label>
                <input type="text" id="username" name="username" class="form-input"
                       value="{{ g.user.username }}" placeholder="请输入用户名">
            </div>

            <!-- 邮箱修改 -->
            <div class="form-group">
                <label for="email" class="form-label">邮箱</label>
                <input type="email" id="email" name="email" class="form-input"
                       value="****{{ g.user.email[-11:] }}" placeholder="请输入邮箱地址" readonly
                       style="cursor: not-allowed; background-color: #f5f5f5; color: #666;">
                <a href="{{ url_for("front.change_email") }}">
                    <button type="button" id="save-email" class="btn btn-secondary save-btn">修改邮箱</button>
                </a>
            </div>

            <!-- 签名修改 -->
            <div class="form-group">
                <label for="signature" class="form-label">个人签名</label>
                <textarea id="signature" name="signature" class="form-textarea"
                          placeholder="请输入个人签名">{{ g.user.signature if g.user.signature else '' }}</textarea>
            </div>

            <div class="form-group button-group">
                <div class="button-wrapper">
                    <button type="button" id="save-count" class="btn btn-secondary save-btn">保存</button>
                    <button type="button" id="cancel-btn" class="btn btn-default cancel-btn">取消</button>
                </div>
            </div>
        </div>
    </div>
{% endblock %}
